<template>
  <el-dialog
    :visible.sync="isShow"
    :title="{ add: '新增企业', edit: '编辑企业' }[mode]"
    center
    @close="closeEvent"
  >
    <el-form label-width="120px" ref="form" :model="form" :rules="rules">
      <el-form-item label="企业编号" prop="eid">
        <el-input v-model="form.eid"></el-input>
      </el-form-item>
      <el-form-item label="企业名称" prop="name">
        <el-input v-model="form.name"></el-input>
      </el-form-item>
      <el-form-item label="企业简称" prop="short_name">
        <el-input v-model="form.short_name"></el-input>
      </el-form-item>
      <el-form-item label="企业简介" prop="intro">
        <el-input v-model="form.intro"></el-input>
      </el-form-item>
      <el-form-item label="备注" prop="remark">
        <el-input v-model="form.remark"></el-input>
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button @click="isShow = false">取消</el-button>
      <el-button type="primary" @click="submit">确认</el-button>
    </template>
  </el-dialog>
</template>

<script>
import { enterpriseAdd, enterpriseEdit } from '@/api/business'
export default {
  props: {
    businessList: {
      required: true,
      type: Array
    }
  },
  data () {
    return {
      mode: '',
      isShow: false,
      form: {
        eid: '', // 是 string 企业编号
        name: '', // 是 string 企业名称
        short_name: '', // 是 string 简称
        intro: '', // 是 string 企业简介
        remark: '' // 否 string 备注
      },
      rules: {
        eid: [
          { required: true, message: '必填', trigger: 'change' },
          {
            validator: (rule, value, callback) => {
              let bol = []
              if (this.mode === 'add') {
                bol = this.businessList.every(item => item.eid !== value)
              } else if (this.mode === 'edit') {
                const newArr = this.businessList.filter(
                  item => item.id !== this.form.id
                )
                bol = newArr.every(item => item.eid !== value)
              }
              bol ? callback() : callback(new Error('企业编号重复:' + value))
            }
          }
        ],
        name: [
          { required: true, message: '必填', trigger: 'change' },
          {
            validator: (rule, value, callback) => {
              let bol = []
              if (this.mode === 'add') {
                bol = this.businessList.every(item => item.name !== value)
              } else if (this.mode === 'edit') {
                const newArr = this.businessList.filter(
                  item => item.id !== this.form.id
                )
                bol = newArr.every(item => item.name !== value)
              }
              bol ? callback() : callback(new Error('企业名称重复:' + value))
            }
          }
        ],
        short_name: [{ required: true, message: '必填', trigger: 'change' }],
        intro: [{ required: true, message: '必填', trigger: 'change' }]
      }
    }
  },
  methods: {
    // 点击确认
    submit () {
      this.$refs.form.validate(async result => {
        if (result) {
          if (this.mode === 'add') {
            await enterpriseAdd(this.form)
            this.$message.success('新增成功')
          } else if (this.mode === 'edit') {
            await enterpriseEdit(this.form)
            this.$message.success('修改成功')
          }
          this.isShow = false
          this.$emit('getData')
        }
      })
    },
    // 弹框关闭
    closeEvent () {
      this.$refs.form.resetFields()
      this.form = {
        eid: '', // 是 string 企业编号
        name: '', // 是 string 企业名称
        short_name: '', // 是 string 简称
        intro: '', // 是 string 企业简介
        remark: '' // 否 string 备注
      }
    }
  }
}
</script>

<style></style>
